<!DOCTYPE HTML>
<html>
	<head>
		<title>Products</title>
		<link href="css/bootstrap.css" rel='stylesheet' type='text/css' />
		<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
		<script src="js/jquery.min.js"></script>
		 <!-- Custom Theme files -->
		<link href="css/style.css" rel='stylesheet' type='text/css' />
   		 <!-- Custom Theme files -->
   		 <!---- start-smoth-scrolling---->
		<script type="text/javascript" src="js/move-top.js"></script>
		<script type="text/javascript" src="js/easing.js"></script>
		<script type="text/javascript">
			jQuery(document).ready(function($) {
				$(".scroll").click(function(event){		
					event.preventDefault();
					$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
				});
			});
		</script>
		 <!---- start-smoth-scrolling---->
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false); function hideURLbar(){ window.scrollTo(0,1); } </script>
		</script>
		<!----webfonts--->
		
		<!---//webfonts--->
		<!----start-top-nav-script---->
		<script>
			$(function() {
				var pull 		= $('#pull');
					menu 		= $('nav ul');
					menuHeight	= menu.height();
				$(pull).on('click', function(e) {
					e.preventDefault();
					menu.slideToggle();
				});
				$(window).resize(function(){
	        		var w = $(window).width();
	        		if(w > 320 && menu.is(':hidden')) {
	        			menu.removeAttr('style');
	        		}
	    		});
			});
		</script>
		<!----//End-top-nav-script---->
	</head>
	<body>
		<!----container---->
		<div class="container">
			<!----top-header---->
			<div class="top-header">
				<div class="logo">
					<a href="index.html"><img src="images/logo.png" title="barndlogo" /></a>
				</div>
				<div class="top-header-info">
					<div class="top-contact-info">
						<ul class="unstyled-list list-inline">
							<li><span class="phone"> </span>090 - 223 44 66</li>
							<li><span class="mail"> </span><a href="#">help@trendd.com</a></li>
							<div class="clearfix"> </div>
						</ul>
					</div>
					<div class="cart-details">
						<div class="add-to-cart">
							<ul class="unstyled-list list-inline">
								<li><span class="cart"> </span>
									<ul class="cart-sub">
										<li><p>0 Products</p></li>
									</ul>
								</li>
							</ul>
						</div>
						<div class="login-rigister">
							<ul class="unstyled-list list-inline">
								<li><a class="login" href="#">Login</a></li>
								<li><a class="rigister" href="#">REGISTER <span> </span></a></li>
								<div class="clearfix"> </div>
							</ul>
						</div>
						<div class="clearfix"> </div>
					</div>
				</div>
				<div class="clearfix"> </div>
			</div>
			<!----//top-header---->
			<!---top-header-nav---->
			<div class="top-header-nav"> 
			<!----start-top-nav---->
			 <nav class="top-nav main-menu">
					<ul class="top-nav">
						<li><a href="products.html">PRODUCTS </a><span> </span></li>
						<li><a href="products.html">CAMPAINGS</a><span> </span></li>
						<li><a href="products.html">SERVICES</a><span> </span></li>
						<li><a href="products.html">BRANDS</a><span> </span></li>
						<li><a href="products.html">ABOUT US</a></li>
						<div class="clearfix"> </div>
					</ul>
					<a href="#" id="pull"><img src="images/nav-icon.png" title="menu" /></a>
			  </nav>
			  <!----End-top-nav---->
			  <!---top-header-search-box--->
			  <div class="top-header-search-box">
			  	<form>
			  		<input type="text" placeholder="Search" required / maxlength="22">
			  		<input type="submit" value=" " >
			  	</form>
			  </div>
			  <!---top-header-search-box--->
						<div class="clearfix"> </div>
			</div>
		</div>
			<!--//top-header-nav---->
			<!----content---->
				<div class="content">
					<div class="container">
				<!--- products ---->
				<div class="products">
					<div class="product-filter">
						<h1><a href="#">FILTER</a></h1>
						<div class="product-filter-grids"> 
							<div class="col-md-3 product-filter-grid1-brands">
								<h3>BRANDS</h3>
								<ul class="col-md-6 unstyled-list b-list1">
									<li><a href="#">adidas</a></li>
									<li><a href="#">nike</a></li>
									<li><a href="#">camper</a></li>
									<li><a href="#">superga</a></li>
									<li><a href="#">timberland</a></li>
									<li><a href="#">new balance</a></li>
									<li><a href="#">converse</a></li>
									<li><a href="#">puma</a></li>
									<li><a href="#">kinetix</a></li>
									<div class="clearfix"> </div>
								</ul>
								<ul class="col-md-6 unstyled-list b-list2">
									<li><a href="#">tiger</a></li>
									<li><a href="#">lacoste</a></li>
									<li><a href="#">eebok</a></li>
									<li><a href="#">cat</a></li>
									<li><a href="#">dockers</a></li>
									<div class="clearfix"> </div>
								</ul>
								<div class="clearfix"> </div>
							</div>
							<!---->
							<div class="col-md-6 product-filter-grid1-brands-col2">
									<div class="producst-cate-grids">
										<div class="col-md-4 producst-cate-grid text-center">
											<h2>WOMAN</h2>
											<img class="r-img text-center img-responsive" src="images/img-w.jpg" title="name">
											<span><img src="images/objs1.png" title="name"></span>
											<h4>TOTAL</h4>
											<label>357 PRODUCTS</label>
											<a class="r-list-w" href="#"><img src="images/list-icon.png" title="list"></a>
										</div>
										<div class="col-md-4 producst-cate-grid text-center">
											<h2>MAN</h2>
											<img class="r-img text-center img-responsive" src="images/man-r-img.jpg" title="name">
											<span><img src="images/objs2.png" title="name"></span>
											<h4>TOTAL</h4>
											<label>357 PRODUCTS</label>
											<a class="r-list-w" href="#"><img src="images/list-icon.png" title="list"></a>
										</div>
										<div class="col-md-4 producst-cate-grid text-center">
											<h2>KIDS</h2>
											<img class="r-img text-center img-responsive" src="images/kid-r-img.jpg" title="name">
											<span><img src="images/objs3.png" title="name"></span>
											<h4>TOTAL</h4>
											<label>357 PRODUCTS</label>
											<a class="r-list-w" href="#"><img src="images/list-icon.png" title="list"></a>
										</div>
									</div>
							</div>
							<!---->
							<div class="product-filter-grid1-brands-col3">
								<div class="products-colors">
									<h3>SELECT COLOR </h3>
									<li><a href="#"><span class="color1"> </span></a></li>
									<li><a href="#"><span class="color2"> </span></a></li>
									<li><a href="#"><span class="color3"> </span></a></li>
									<li><a href="#"><span class="color4"> </span></a></li>
									<li><a href="#"><span class="color5"> </span></a></li>
									<li><a href="#"><span class="color6"> </span></a></li>
									<li><a href="#"><span class="color7"> </span></a></li>
									<li><a href="#"><span class="color8"> </span></a></li>
									<li><a href="#"><span class="color9"> </span></a></li>
									<li><a href="#"><span class="color10"> </span></a></li>
									<li><a href="#"><span class="color11"> </span></a></li>
									<li><a href="#"><span class="color12"> </span></a></li>
									<li><a href="#"><span class="color13"> </span></a></li>
									<li><a href="#"><span class="color14"> </span></a></li>
									<li><a href="#"><span class="color15"> </span></a></li>
									<li><a href="#"><span class="color16"> </span></a></li>
									<li><a href="#"><span class="color17"> </span></a></li>
									<li><a href="#"><span class="color18"> </span></a></li>
									<li><a href="#"><span class="color19"> </span></a></li>
									<li><a href="#"><span class="color20"> </span></a></li>
									<div class="clearfix"> </div>
								</div>
							</div>
							<div class="clearfix"> </div>
						</div>
					</div>
				</div>
				<div class="clearfix"> </div>
				<!-- //products ---->
				<!----speical-products---->
				<div class="special-products all-poroducts">
					<div class="s-products-head">
						<div class="s-products-head-left">
							<h3>SPECIAL <span>PRODUCTS</span></h3>
						</div>
						<div class="s-products-head-right">
							<a href="#"><span> </span>view all products</a>
						</div>
						<div class="clearfix"> </div>
					</div>
					<!----special-products-grids---->
					<div class="special-products-grids">
						<div class="col-md-3 special-products-grid text-center">
							<a class="brand-name" href="single-page.html"><img src="images/b1.jpg" title="name" /></a>
							<a class="product-here" href="single-page.html"><img src="images/p1.jpg" title="product-name" /></a>
							<h4><a href="single-page.html">Nike Roshe Run</a></h4>
							<a class="product-btn" href="single-page.html"><span>109.90$</span><small>GET NOW</small><label> </label></a>
						</div>
						<div class="col-md-3 special-products-grid text-center">
							<a class="brand-name" href="single-page.html"><img src="images/b2.jpg" title="name" /></a>
							<a class="product-here" href="single-page.html"><img src="images/p2.jpg" title="product-name" /></a>
							<h4><a href="single-page.html">Line Link 67009</a></h4>
							<a class="product-btn" href="single-page.html"><span>109.90$</span><small>GET NOW</small><label> </label></a>
						</div>
						<div class="col-md-3 special-products-grid text-center">
							<a class="brand-name" href="single-page.html"><img src="images/b3.jpg" title="name" /></a>
							<a class="product-here" href="single-page.html"><img src="images/p3.jpg" title="product-name" /></a>
							<h4><a href="single-page.html">Minimus Zero </a></h4>
							<a class="product-btn" href="single-page.html"><span>109.90$</span><small>GET NOW</small><label> </label></a>
						</div>
						<div class="col-md-3 special-products-grid text-center">
							<a class="brand-name" href="single-page.html"><img src="images/b4.jpg" title="name" /></a>
							<a class="product-here" href="single-page.html"><img src="images/p4.jpg" title="product-name" /></a>
							<h4><a href="single-page.html"> Athletic Shoe </a></h4>
							<a class="product-btn" href="single-page.html"><span>109.90$</span><small>GET NOW</small><label> </label></a>
						</div>
						<div class="col-md-3 special-products-grid text-center">
							<a class="brand-name" href="single-page.html"><img src="images/b5.jpg" title="name" /></a>
							<a class="product-here" href="single-page.html"><img src="images/p2.jpg" title="product-name" /></a>
							<h4><a href="single-page.html">Veronique </a></h4>
							<a class="product-btn" href="single-page.html"><span>109.90$</span><small>GET NOW</small><label> </label></a>
						</div>
						<div class="col-md-3 special-products-grid text-center">
							<a class="brand-name" href="single-page.html"><img src="images/b6.jpg" title="name" /></a>
							<a class="product-here" href="single-page.html"><img src="images/p6.jpg" title="product-name" /></a>
							<h4><a href="single-page.html">Suede Boots </a></h4>
							<a class="product-btn" href="single-page.html"><span>109.90$</span><small>GET NOW</small><label> </label></a>
						</div>
						<div class="col-md-3 special-products-grid text-center">
							<a class="brand-name" href="single-page.html"><img src="images/b7.jpg" title="name" /></a>
							<a class="product-here" href="single-page.html"><img src="images/p7.jpg" title="product-name" /></a>
							<h4><a href="single-page.html">Barricade 6.0  </a></h4>
							<a class="product-btn" href="single-page.html"><span>109.90$</span><small>GET NOW</small><label> </label></a>
						</div>
						<div class="col-md-3 special-products-grid text-center">
							<a class="brand-name" href="single-page.html"><img src="images/b1.jpg" title="name" /></a>
							<a class="product-here" href="single-page.html"><img src="images/p8.jpg" title="product-name" /></a>
							<h4><a href="single-page.html">Cotu Classic </a></h4>
							<a class="product-btn" href="single-page.html"><span>109.90$</span><small>GET NOW</small><label> </label></a>
						</div>
						<div class="clearfix"> </div>
					</div>
					<!---//special-products-grids---->
				</div>
				<!----->
				<div class="special-products all-poroducts latest-products">
					<div class="s-products-head">
						<div class="s-products-head-left">
							<h3>LATEST <span>PRODUCTS</span></h3>
						</div>
						<div class="s-products-head-right">
							<a href="#"><span> </span>view all products</a>
						</div>
						<div class="clearfix"> </div>
					</div>
					<!----special-products-grids---->
					<div class="special-products-grids">
						<div class="col-md-3 special-products-grid text-center">
							<a class="brand-name" href="single-page.html"><img src="images/b1.jpg" title="name" /></a>
							<a class="product-here" href="single-page.html"><img src="images/p1.jpg" title="product-name" /></a>
							<h4><a href="#">Nike Roshe Run</a></h4>
							<a class="product-btn" href="single-page.html"><span>109.90$</span><small>GET NOW</small><label> </label></a>
						</div>
						<div class="col-md-3 special-products-grid text-center">
							<a class="brand-name" href="single-page.html"><img src="images/b2.jpg" title="name" /></a>
							<a class="product-here" href="single-page.html"><img src="images/p2.jpg" title="product-name" /></a>
							<h4><a href="#">Line Link 67009</a></h4>
							<a class="product-btn" href="single-page.html"><span>109.90$</span><small>GET NOW</small><label> </label></a>
						</div>
						<div class="col-md-3 special-products-grid text-center">
							<a class="brand-name" href="single-page.html"><img src="images/b3.jpg" title="name" /></a>
							<a class="product-here" href="single-page.html"><img src="images/p3.jpg" title="product-name" /></a>
							<h4><a href="single-page.html">Minimus Zero </a></h4>
							<a class="product-btn" href="single-page.html"><span>109.90$</span><small>GET NOW</small><label> </label></a>
						</div>
						<div class="col-md-3 special-products-grid text-center">
							<a class="brand-name" href="single-page.html"><img src="images/b4.jpg" title="name" /></a>
							<a class="product-here" href="single-page.html"><img src="images/p4.jpg" title="product-name" /></a>
							<h4><a href="single-page.html"> Athletic Shoe </a></h4>
							<a class="product-btn" href="single-page.html"><span>109.90$</span><small>GET NOW</small><label> </label></a>
						</div>
						<div class="col-md-3 special-products-grid text-center">
							<a class="brand-name" href="single-page.html"><img src="images/b5.jpg" title="name" /></a>
							<a class="product-here" href="single-page.html"><img src="images/p2.jpg" title="product-name" /></a>
							<h4><a href="single-page.html">Veronique </a></h4>
							<a class="product-btn" href="single-page.html"><span>109.90$</span><small>GET NOW</small><label> </label></a>
						</div>
						<div class="col-md-3 special-products-grid text-center">
							<a class="brand-name" href="single-page.html"><img src="images/b6.jpg" title="name" /></a>
							<a class="product-here" href="single-page.html"><img src="images/p6.jpg" title="product-name" /></a>
							<h4><a href="single-page.html">Suede Boots </a></h4>
							<a class="product-btn" href="single-page.html"><span>109.90$</span><small>GET NOW</small><label> </label></a>
						</div>
						<div class="col-md-3 special-products-grid text-center">
							<a class="brand-name" href="single-page.html"><img src="images/b7.jpg" title="name" /></a>
							<a class="product-here" href="single-page.html"><img src="images/p7.jpg" title="product-name" /></a>
							<h4><a href="single-page.html">Barricade 6.0  </a></h4>
							<a class="product-btn" href="single-page.html"><span>109.90$</span><small>GET NOW</small><label> </label></a>
						</div>
						<div class="col-md-3 special-products-grid text-center">
							<a class="brand-name" href="single-page.html"><img src="images/b1.jpg" title="name" /></a>
							<a class="product-here" href="single-page.html"><img src="images/p8.jpg" title="product-name" /></a>
							<h4><a href="single-page.html">Cotu Classic </a></h4>
							<a class="product-btn" href="single-page.html"><span>109.90$</span><small>GET NOW</small><label> </label></a>
						</div>
						<div class="clearfix"> </div>
					</div>
					<!---//special-products-grids---->
				</div>
				<!---//speical-products---->
				</div>
			<!----content---->
			<!----footer--->
			<div class="footer">
				<div class="container">
					<div class="col-md-3 footer-logo">
						<a href="index.html"><img src="images/flogo.png" title="brand-logo" /></a>
					</div>
					<div class="col-md-7 footer-links">
						<ul class="unstyled-list list-inline">
							<li><a href="#"> Faq</a> <span> </span></li>
							<li><a href="#"> Terms and Conditions</a> <span> </span></li>
							<li><a href="#"> Secure Payments</a> <span> </span></li>
							<li><a href="#"> Shipping</a> <span> </span></li>
							<li><a href="contact.html"> Contact</a> </li>
							<div class="clearfix"> </div>
						</ul>
					</div>
					<div class="col-md-2 footer-social">
						<ul class="unstyled-list list-inline">
							<li><a class="pin" href="#"><span> </span></a></li>
							<li><a class="twitter" href="#"><span> </span></a></li>
							<li><a class="facebook" href="#"><span> </span></a></li>
							<div class="clearfix"> </div>
						</ul>
					</div>
					<div class="clearfix"> </div>
				</div>
			 </div>
			 <div class="clearfix"> </div>
			<!---//footer--->
			<!---copy-right--->
					<div class="copy-right">
						<div class="container">
							<p>Copyright &copy; 2014.Company name All rights reserved.<a target="_blank" href="http://www.cssmoban.com/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a> - More Templates <a href="http://www.cssmoban.com/" target="_blank" title="模板之家">模板之家</a></p>
							<script type="text/javascript">
									$(document).ready(function() {
										/*
										var defaults = {
								  			containerID: 'toTop', // fading element id
											containerHoverID: 'toTopHover', // fading element hover id
											scrollSpeed: 1200,
											easingType: 'linear' 
								 		};
										*/
										
										$().UItoTop({ easingType: 'easeOutQuart' });
										
									});
								</script>
							<a href="#" id="toTop" style="display: block;"> <span id="toTopHover" style="opacity: 1;"> </span></a>
						</div>
					</div>
			<!--//copy-right--->
		</div>
		<!----container---->
	
</body>
</html>

